<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition template="../template/index.xhtml"
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:c="http://java.sun.com/jsp/jstl/core">
	<ui:define name="title">
		
	</ui:define>
	<ui:define name="lcontent">
		<ui:include src="/template/menu-left/human-resources.xhtml"></ui:include>
	</ui:define>
	<ui:define name="rcontent">
		<span class="rtitle">Danh sách phòng ban</span>
		<hr />
		<a class="button-link green-bt open-newDepartmentDialog"> + Thêm
			phòng ban mới </a>
		<a class="button-link white-bt" id="openSearchButton"> <img
			src="#{facesContext.externalContext.requestContextPath}/resources/images/icons/search.png" alt="" /> </a>
		<a class="button-link white-bt load reload-btn"> <img
			src="#{facesContext.externalContext.requestContextPath}/resources/images/icons/refresh.png" alt="" /> </a>
		<span class="clear"></span>

		<div id="searchPanel" class="search-panel none">
			<h:form id="searchForm">
				<f:event type="preRenderView" listener="#{department.onload}" />
				<span class="search-panel-title">Tên bộ phận</span>
				<h:inputText styleClass="input w80" value="#{department.nameSearch}"></h:inputText>
				<span class="clear"></span>
				<h:commandButton value="Tìm kiếm" class="button white-bt load"
					action="#{department.search}">
				</h:commandButton>
				<span class="clear"></span>
			</h:form>
		</div>
		<h:form id="resultForm">
			<div class="list">
				<div class="nav-page-tp result-paging">
					Trang
					<h:selectOneMenu value="#{department.currentPage}">
						<f:selectItems value="#{department.pages}"></f:selectItems>
					</h:selectOneMenu>
					<h:commandLink id="paging-click" styleClass="hide load"
						action="#{department.paging}"></h:commandLink>
				</div>
				<span class="result-detail">Total 106 records. Showing 1 to
					20</span>
				<ui:repeat var="var" value="#{department.listDepartment}">
					<div class="list-item">
						<table>
							<tr>
								<td class="list-item-checked"><h:selectBooleanCheckbox
										styleClass="cbx">
									</h:selectBooleanCheckbox></td>
								<td><h:commandLink
										styleClass="list-item-click open-updateDepartmentDialog"
										actionListener="#{department.choose}">
											#{var.name}
											<f:ajax render=":formUpdateDepartment" />
											<f:attribute name="object" value="#{var}"></f:attribute>
									</h:commandLink> <br /> <span class="clear"></span> 
									<span class="list-item-created">
										Được tạo bởi 
										<h:outputText value="#{var.created_by}"/> vào 
										<h:outputText value="#{var.created_date}">
											<f:convertDateTime pattern="dd/MM/yyyy hh:mm:ss"/>
										</h:outputText> 
										| Thay đổi bởi 
										<h:outputText value="#{var.modified_by}"/> vào 
										<h:outputText value="#{var.modified_date}">
											<f:convertDateTime pattern="dd/MM/yyyy hh:mm:ss"/>
										</h:outputText>
									</span>
								</td>
							</tr>
						</table>
					</div>
				</ui:repeat>
			</div>
		</h:form>
		<span class="clear"></span>
			<div class="wrap-dialog none" id="newDepartmentDialog">
				<div class="dialog">
					<span class="dialog-title">Thêm mới phòng ban<b
						class="close-dialog">x</b>
					</span>
					<div class="dialog-content">
						<h:form id="formNewDepartment">
						<table class="input-column w100">
							<tr>
								<td>
									<div class="input-item">
										<span class="block required">Tên phòng ban <img align="top"
									src="#{facesContext.externalContext.requestContextPath}/resources/images/error.gif" /></span>
										<h:inputText styleClass="input w80" required="true" requiredMessage="Tên không được để trống"
											value="#{department.department.name}" maxlength="100"></h:inputText>
										<span class="italic block">Tên phòng ban không được
											phép trùng nhau</span>
									</div></td>
							</tr>
							<tr>
								<td><h:commandButton styleClass="button green-bt"
										action="#{department.insert}" value="Tạo mới">
									</h:commandButton>
								</td>
							</tr>
						</table>
						</h:form>
					</div>
				</div>
			</div>
			<div class="wrap-dialog none" id="updateDepartmentDialog">
				<div class="dialog">
					
					<span class="dialog-title">Cập nhật phòng ban<b
						class="close-dialog effect">x</b>
					</span>
					<div class="dialog-content">					
						<h:form id="formUpdateDepartment">
						<table class="input-column w100">
							<tr>
								<td>
									<div class="input-item">
										<span class="block required">Tên phòng ban <img align="top"
									src="#{facesContext.externalContext.requestContextPath}/resources/images/error.gif" /></span>
										<h:inputText styleClass="input w80"
											value="#{department.selectedDepartment.name}" maxlength="100"
											required="true" requiredMessage="Tên không được để trống"></h:inputText>
										<span class="italic block">Tên phòng ban không được
											phép trùng nhau</span>
									</div></td>
							</tr>
							<tr>
								<td><h:commandButton styleClass="button green-bt"
										action="#{department.update}" value="Lưu lại">
									</h:commandButton>
								</td>
							</tr>
						</table>								
						</h:form>
					</div>			
				</div>
			</div>
	</ui:define>
</ui:composition>